<template>
	<view class="address-container">
		<view class="title">地址列表</view>
		<uni-list>
			<uni-list-item v-for="item in list">
				<template v-slot:header>
					<view class="slot-box" v-show="is_select==true?true:false" @click="goOrder(item)"
						style="padding-right:10upx">
						<radio value="r1" color="#ff6164" style="transform:scale(0.7)"
							:checked="address_id==item.id?true:false" />
						</label>
					</view>
				</template>
				<template v-slot:body>
					<view style="flex:1">
						<view style="display:flex">
							<view>{{item.address}}</view>
							<view class="tag" v-if="item.is_default==1">默认</view>
						</view>
						<view style="font-size:24upx;color:#999;margin-top:10upx">{{item.name+item.sex}} {{item.phone}}
						</view>
					</view>
				</template>
				<template v-slot:footer>
					<uni-icons @click.stop="goEdit(item.id)" type="compose" size="20"></uni-icons>
				</template>
			</uni-list-item>
		</uni-list>
		<view class="btn-box">
			<view class="btn" @click="goAdd()">新增收货地址
			</view>
		</view>
		<kModel ref="kModel" />
	</view>
</template>
<script>
	import kModel from '@/components/k-model/k-model.vue';
	export default {
		components: {
			kModel
		},
		data() {
			return {
				address_id: null,
				is_select: true,
				list: [],
			}
		},

		onLoad() {
			this.is_select = this.$Route.query.is_select
		},

		onShow() {
			this.getList()
		},
		methods: {
			goOrder: function(item) {
				if (this.is_select == false) {
					return false
				}
				this.$store.commit('setAddressInfo', item);
				this.$Router.push({
					path: '/pages/balance/balance'
				})
			},
			goAdd: function() {
				this.$Router.push({
					path: '/pages/address_add/address_add'
				})
			},
			goEdit: function(id) {
				this.$Router.push({
					path: '/pages/address_add/address_add',
					query: {
						id: id
					},
				})
			},
			getList: function() {
				this.$myRequest('address/list', {}).then((res) => {
					this.list = res.data
				})
			},
		}
	}
</script>

<style lang="scss">
	.title {
		color: #888;
		margin: 20upx;
		font-size: 24upx;
	}

	.uni-list-item__container {
		align-items: center;
	}

	.tag {
		margin-left: 10upx;
		color: #fff;
		padding: 8upx 10upx;
		font-size: 20upx;
		background-color: $uni-text-color-grey;
		border-radius: 10upx;
	}

	.btn-box {
		position: fixed;
		bottom: 0;
		padding: 30upx;
		padding-bottom: 60upx;
		width: 100%;
		box-sizing: border-box;

		.btn {
			padding: 30upx 0;
			font-size: 26upx;
			color: $uni-color-green;
			background: $uni-color-team;
			width: 100%;
			border-radius: 20upx;
			text-align: center;
		}
	}
</style>
